<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
</body>
</html>
<script>
    //vue中$nextTick有什么作用
    /**
     * 是什么？ 在下次DOM更新后循环后进行延迟回调。在数据修改之后立即执行这个方法 获取更新后的dom
     * 什么意思？ vue在更新dom时是异步操作。当数据发生变化vue将开启一个异步更新队列，试图需要等队列中所有数据变化完成之后在同一更新
     * 为什么要有nextTick
     * 如果想要在数据更新之后立刻获取dom元素就可以使用nextTick 第一个参数为回调函数 第二个参数是执行函数上下文
     * 全局使用是在vue.nextTick中使用 组件中使用 this.nextTick并回调函数中的this绑定到vue实例中
     * 它会返回一个promise对象 可以用async 和await来实现
    */
   //vue权限管理怎么做，按钮级别的权限怎么做
   /**
    * 权限管理就是给不同的用户分配不同被访问的资源
    * 路由方面 用户登录后只能看到自己有权访问的页面，也只能访问自己有权限的路由，否则为空
    * 试图方面 用户只能看到自己有权能浏览访问的页面和有权的操作按键
    * 请求控制 路有可能配置失败 操作按钮可能未加权限  这个时候跨越权限请求将在前端被拦截
    * 如何做 
    * 前端权限控制可分为四个方面： 接口权限 按钮权限 菜单权限和路由权限
    * 
    * 接口权限：接口权限一般采用jwt的形式验证，没有通过一般返回401，跳转到登录页面重新登陆拿到token将token存起来
    *           通过axios请求拦截器每次都要携带token来发送请求
    * 路由权限：初始化的时候不需要给路由加权限 比如登录页和一般的404页面，如果用户强行用url跳转则直接进入404页面，
    *               登陆后，获取用户可以访问的路由权限同过addroutes添加路由
    * 菜单权限：菜单和路由都由后端返回，前端统一定义路由组件，再将后端返回的路由通过addroutes动态挂载添加在component中
    *           缺点：全局路由守卫里每次路由跳转时都要做判断  前后端配合度更高
    * 按钮权限：按钮权限也可以用v-if判断，但是如果页面多，每个页面都有权限这样不简洁
    *           第二种方式是通过自定义指令来进行按钮判断
    * 
   */
  //v-show和v-if的区别
  /**
   * 共同点：他们的效果相同，都能控制元素是否显示，用法也相同如果为true时都会占据页面的位置，false时不会占据
   * 区别：
   *   控制手段不同：v-show是简单的为dom元素添加一个css样式display:none,dom元素依旧还在，v-if显示隐藏将dom元素整个添加或删除
   *   编译过程不同：v-if切换有一个局部编译/写在的过程，切换过程中合适的销毁和重建内部的事件监听器和子组件；v-show只是简单的css切换
   *   编译条件不同：v-if才是真正的条件渲染，切换过程中条件内的事件监听器和子组件适当的销毁和重建，为false时什么也不做
   *                 v-show由false到true时不会触发组件的生命周期
   *                 v-if由false到true时会触发组建的beforeCreate、created、beforemounte、mounted钩子函数
   *                 由true变为false时会触发beforedestory、destoryed钩子函数
   *                 v-if具有更高的性能消耗，v-show具有更高的初始渲染消耗
   * 
  */
</script>